<style type="text/css">
*{margin:0;padding:0;}
body{color:#333;overflow: hidden;margin: 0px;padding:5px;background: white;font-size:12px;}
#box{
    width:170px;
    height:100px;
    border:1px solid red;
}
img{margin:0 4px;}
#addItemDiv{color:#ccc;}
.hide{display:none;}
.show{display:block;}
.taskItem{cursor:pointer;}
input{width:100%;}
</style>
<div id="box">
<div id="newItem" class="gray">add</div>
<div id="addDiv" class="hide"><input type="text" id="txtTitle" /></div>
<div id="taskItemList">
    <div class="taskItem">
        <span class="taskTitle">new task</span>
    </div>
    <div class="taskItem">
        <span class="taskTitle">completed task</span>
    </div>
</div>
</div>